<template>
	<div class="completion-page">
		<a-card class="completion-card">
			<div class="completion-content">
				<check-circle-outlined class="success-icon" />
				<h2 class="completion-title">您已填写完全部信息</h2>
				<p class="completion-message">感谢您完成入职登记信息的填写，我们将会尽快审核您的资料。</p>
			</div>
		</a-card>
	</div>
</template>

<script setup>
	import { CheckCircleOutlined } from '@ant-design/icons-vue'
</script>

<style scoped>
	.completion-page {
		display: flex;
		justify-content: center;
		align-items: center;
		min-height: 100vh;
		background-color: #f5f5f5;
		padding: 20px;
	}

	.completion-card {
		width: 100%;
		max-width: 600px;
		border-radius: 8px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	}

	.completion-content {
		text-align: center;
		padding: 40px 20px;
	}

	.success-icon {
		font-size: 64px;
		color: #52c41a;
		margin-bottom: 20px;
	}

	.completion-title {
		font-size: 24px;
		color: #333;
		margin-bottom: 16px;
	}

	.completion-message {
		font-size: 16px;
		color: #666;
		line-height: 1.5;
	}
</style>
